<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<c:set var="path" value="${pageContext.request.contextPath }" />
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>健康管理</title>
	<meta name="viewport"  content="width=device-width, initial-scale=1">
	<link rel="stylesheet" type="text/css" href="${path}/resource/plugins/bootstrap/css/bootstrap.min.css">
  	<link rel="stylesheet" type="text/css" href="${path}/resource/css/ysrmain.css">
	<link rel="stylesheet" href="${path}/resource/css/gzfx.css">
	
	<script src="${path}/resource/plugins/jQuery/jquery-2.2.3.min.js"></script>
	<script type="text/javascript" src="${path}/resource/plugins/bootstrap/js/bootstrap.min.js"></script>
	<script type="text/javascript" src="${path}/resource/js/echarts.min.js"></script>

	<script type="text/javascript"></script>
	<style>
		.foot-div1{	display:block;color: #fff;}
		.color-blue{color:#338edd;}
		.font-s2{font-size:2rem;}
		.font-foot{font-size:3rem;color:#337ab7}
		.right-content{
			background: none;
		   	border:none;
		    box-shadow: none;
		}
		
		
		/*主图表*/
		.main-img{font-size:1.6rem}
		.main-img>div{height:100%}
			.main-img .health-img{background:url(${path}/resource/images/gzbg2.png) no-repeat;background-size:100% 100%; margin-top: 20px; height: 95%;text-align:center}
				.health-img img{height:80%;width:80%}
				.health-img span{height: 100%;width: 0;overflow: hidden;display: inline-block;vertical-align: middle;}
			.main-img .danger-msg{color:#fff;border: 1px solid #337ab7;box-shadow: 0px 0px 8px #3399b7;border-top-right-radius: 5px;border-top-left-radius: 5px;background: rgba(0,0,0,0.3);margin-top:20px;height:95%} 
				.msg-title {font-size: 1.6rem;color: #fff;border-bottom: 1px solid #337ab7;background: linear-gradient(to bottom, rgba(37, 180, 191, 0.24) 0%,rgba(201,200,200,0.3) 80%,rgba(67, 112, 150, 0.46) 100%);padding: 8px 30px;margin: 0;}
				.weather{}
				.weather>div{border-radius:5px;height:100%;width: 100%;}
					.weather>div>div{ display: inline-block;vertical-align: middle;text-align: center;width:24%;padding:10px 0}
			.main-img .health-msg{height:70%;font-size:1.4rem }
				
				.main-img .health-msg .table-head>tbody>tr>th{padding-bottom:10px}
				.main-img .health-msg .table>tbody>tr>th{font-size:14px;font-weight:500}
				
				.table-head{margin-bottom:0}
				.main-img .table-msg>tbody>tr:nth-of-type(odd){ background:none}
				.main-img .table-msg>tbody>tr:nth-of-type(even){background:#337ab7}
				.health-msg>div{border-radius:5px;height:100%;padding:0% 4%}
					.health-msg>div>div{padding:1%}
					.health-msg>div>.temperature{padding:0;}
					.progress{margin:0;height:13px;width:40%;display:inline-block}
					.temperature{width:50%;float:left;text-align: right;margin-top:10px}
		.scbg{text-align:center}
		.scbg>a>img{height:57px;}
		.foot-div1>.point,.foot-div2>.point,.foot-div3>.point{padding-left: 30px;text-align:left}
		.foot-div1>div{display:block;	}
		.foot-div2{display:block;color: #fff;}
		.foot-div2>div{display:block;}
		.foot-div3{;width:calc(100% + 15px);color: #fff;}
		.foot-div3>div{text-align:center	}	
		.div-table{display:table;width:100%}
		.div-table>div{display:table-cell;text-align:center;vertical-align: middle;}
		.yes{background:url(${path}/resource/images/yes.png) no-repeat;background-size:100% 100%;display:inline-block;width:20px;height:20px;}
		.error{background:url(${path}/resource/images/error2.png) no-repeat;background-size:100% 100%;display:inline-block;width:20px;height:20px;}
		.foot-span{    display: table-cell;font-size: 1.5rem;text-align: center;vertical-align: middle;}
		/*进度条*/
		.progress{height:80%}
		.ding{display:inline-block;width: 50%;vertical-align: middle;background:none;margin-bottom:0}
		.ding>.progress-bar{background: linear-gradient(to right, rgba(255,255,255,0) 0%,#3a8fd8 100%);}
		.foot-div2>div>div {width:100%;height:33%;padding: 6px 0px 6px 40px;}
		.gjqj1{width: 60%;vertical-align: middle; border: 1px solid #48f2ff;background: none;border-radius:0}
		.gjqj1>.progress-bar{background: linear-gradient(to right, rgba(255,255,255,0) 0%,#3a8fd8 100%);}
		.gjqj2{width: 60%;vertical-align: middle; border: 1px solid #48f2ff;background: none;border-radius:0}
		.gjqj2>.progress-bar{background: linear-gradient(to right, rgba(255,255,255,0) 0%,#48f2ff	 100%);}
		.gjqj3{width: 60%;vertical-align: middle; border: 1px solid #48f2ff;background: none;border-radius:0}
		.gjqj3>.progress-bar{background: linear-gradient(to right, rgba(255,255,255,0) 0%,#37dc88 100%);}
		/*颜色*/
		.red-point{animation:red 0.3s linear infinite alternate;background:red;box-shadow:0 0 10px #fff;width:10px;height:10px;border-radius:50%;display:block;}
		.red-point2{animation:red2 0.3s linear infinite alternate;color:red;text-shadow:0 0 10px #fff;}
		.green-point{background:#3de83d;box-shadow:0 0 10px #fff;width:10px;height:10px;border-radius:50%;display:block;}
		.green-point2{ color:#3de83d	;text-shadow:0 0 10px #fff;}
		.yellow-point{animation:yellow 1s linear infinite alternate;background:yellow;box-shadow:0 0 10px #fff;width:10px;height:10px;border-radius:50%;display:block;}
		.yellow-point2{animation:yellow2 1s linear infinite alternate;color:yellow;text-shadow:0 0 10px #fff;}
			@keyframes red
			{
				from {box-shadow:0 0 10px #fff;background:rgba(255,0,0,1)}
				to {box-shadow:0 0 20px red;background:rgba(255,100,100,1)}
				
			}
			@keyframes red2
			{
				from {text-shadow:0 0 10px #fff;color:rgba(255,0,0,1)}
				to {text-shadow:0 0 20px red;color:rgba(255,100,100,1)}
				
			}
			@keyframes yellow
			{
				from {box-shadow:0 0 5px #fff;background:rgba(255,255,0,1)}
				to {box-shadow:0 0 20px #fff;background:rgba(255,255,255,1)}
				
			}
			@keyframes yellow2
			{
				from {text-shadow:0 0 5px #fff;color:rgba(255,255,0,1)}
				to {text-shadow:0 0 20px #fff;color:rgba(255,255,255,1)}
				
			}
		/*弹窗*/
		.layer{position:absolute;top:0;width:100%;height:100%;left:0;background:url(${path}/resource/images/qbsbbg.png);background-size:100% 100%;z-index:100;display:none}
			.layer-bg{position:absolute;width:50%;height:500px;top:0;bottom:0;left:0;right:0;margin:auto;color:#fff;}				
		       .layer-head{border: 1px solid #337ab7;letter-spacing: 3px;color:#fff;height:50px;line-height:50px;font-size:2rem;padding:0 30px;border-top-right-radius: 5px;border-top-left-radius: 5px;}
			   		.layer-head::after{top:20px}
			   		.layer-head>a{cursor: pointer;height: 30px;display: inline-block;width: 40px;text-align: center;float: right;position: relative;right: -10px;top: 11px;line-height: 25px;font-size: 30px;}
			   		.layer-head>a:hover{color:#3399b7;}
			   .layer-body{border: 1px solid #337ab7;padding:30px 40px;height:90%;border-bottom-right-radius: 5px;border-bottom-left-radius: 5px;color:#333;background: rgba(238, 238, 238, 0.3);}
			   .layer-body2{border: 1px solid #337ab7;padding:30px 40px;height:90%;border-bottom-right-radius: 5px;border-bottom-left-radius: 5px;color:#333;background: rgba(238, 238, 238, 0.3);text-align:center;padding-top: 150px}
			   .layer-body3{border: 1px solid #337ab7;padding:30px 40px;height:90%;border-bottom-right-radius: 5px;border-bottom-left-radius: 5px;color:#333;background: rgba(238, 238, 238, 0.3);text-align:center;padding-top: 150px}
					.layer-msg{width:50%;float:left;height:95%;border-right: 2px solid #3399b7;}
					.layer-analyse{width:50%;float:right;height:100%;}
				 		.analyse-img{margin:10px;height:50%;border-bottom:2px dotted #3399b7}
				 	    .analyse-span{margin:10px;height:40%;}
		/*search*/
		.search-span{background: linear-gradient(to bottom, #337ab7 0%,rgba(255, 255, 255, 0.1) 51%,rgb(128, 209, 238) 100%);border-top-right-radius: 5px;border-bottom-right-radius: 5px;}
   		.layer-search{ display: flex;justify-content: space-between;align-items: center;background: rgb(16, 79, 130);padding: 10px;border-top-right-radius: 5px;border-top-left-radius: 5px}
		.search-msg{font-size:16px}
		.layer-main .input-group{width:200px;box-shadow: 0px 0px 19px #43acdb;}
		/*layer表格  */ 
		.layer-main{border: 1px solid #2196F3;border-radius: 5px;}
		.layer .layer-table>tbody>tr:nth-of-type(even){background:rgba(228, 235, 241, 0.3);}
		.layer .layer-table>tbody>tr:nth-of-type(odd){background:none}
		.div-table2{height: 230px;overflow-y: auto;cursor:pointer}
		.layer-table td{color: #fff;font-size:16px}
		.layer-table th{font-size:16px}
		.consignee{border: 1px solid #2196F3;width: 100%;margin-top:20px;border-radius:5px;font-size:20px;line-height:39px;height:40px}
		
		.c-name{width: 20%;background: rgb(16, 79, 130);float: left;border-radius: 5px ;text-align: center;color: #48f2ff}
		.c-names{width: 80%;float: left;padding-left: 20px}
		.sure-btn{float: right; padding-top:20px}
		.sure-btn >span{cursor: pointer;margin-left:20px;letter-spacing: 20px;padding-left: 20px;line-height: 30px;font-size: 18px;border: 1px solid #165282;color: #fff;border-radius: 5px;}
		.selected{background:#2196F3 !important; }
		.sending{
	   		animation: myfirst 5s linear 0s infinite normal;
			/* Firefox: */
			-moz-animation: myfirst 5s linear 0s infinite normal;
			/* Safari 和 Chrome: */
			-webkit-animation: myfirst 5s linear 0s infinite normal;
			/* Opera: */
			-o-animation: myfirst 5s linear 0s infinite normal;
	   	}
	   	@keyframes myfirst{
	   		0%   {transform:rotate(0deg);}
			100% {transform:rotate(359deg);}
	
	   	}
	</style>
</head>
<body>
	<!-- 头部 -->
	<!-- 开始 -->
	<jsp:include page="top_nav.jsp"></jsp:include>
	<!-- 头部结束 -->
    
    <!-- 右侧内容区域 -->
    <div class="right-content container-fluid ">
    	<div class="row">
    		<!-- 主要图表区域 -->
	    	<div class="main-data col-xs-9">
	    		<!--头部nav-->
	    		<div class="row right-nav">
	    			<div class=" center" style="padding-right:40px">
	    				<a class="color-m1" href="${path}/manage/redirect/allEquip/allEquipList">
	    					<img src="${path}/resource/images/back3.png">
	    				</a>
	    			</div>
	    			<div class=" center nav-hover">
	    				<a class="color-m1" href="${path}/manage/redirect/allEquip/nowEquip?serialNum=${serialNum}">
	    				<img src="${path}/resource/images/sssj3.png">
	    				运行状态
	    				</a>
	    			</div>
	    			<div class=" center nav-hover">
	    				<a class="color-m1" href="${path}/manage/redirect/allEquip/faultAnalysis?serialNum=${serialNum}">
	    				<img src="${path}/resource/images/gzfx3.png">
	    				故障分析
	    				</a>
	    			</div>
	    			<div class=" center nav-hover">
	    				<a class="color-m1" href="${path}/manage/redirect/allEquip/energyEfficiency?serialNum=${serialNum}">
	    				<img src="${path}/resource/images/nxgl3.png">
	    				能效分析
	    				</a>
	    			</div>
	    			<div class=" center nav-select">
	    				<a class="color-m2" href="${path}/manage/redirect/allEquip/healthControl?serialNum=${serialNum}">
	    				<img src="${path}/resource/images/jkgl2.png">
	    				健康管理
	    				</a>
	    			</div>
	    			<div class=" center nav-hover">
	    				<a class="color-m1" href="${path}/manage/redirect/allEquip/historyEquip?serialNum=${serialNum}">
	    				<img src="${path}/resource/images/lssj3.png">
	    				历史数据
	    				</a>
	    			</div>
	    			
	    			<div class=" right nav-over padding-r-1">	    				
	    				<div class="color-w">当前设备:${serialNum}</div>
	    			</div>
	    			
	    		</div>
	    		<!-- 主图表 -->
	    		<div class="main-img">
	    			<div class="col-xs-6">
	    				<div class="health-img">    					    				
	    					<img src="${path}/resource/images/jkgljq.png">
	    					<span></span>
	    				</div>
	    				
	    			</div>
	    			<div class="col-xs-6">
	    				
	    				<div class="danger-msg">
							<div class="point foot-name">实时信息</div>
		    				
		    				<div class="health-msg">
		    					<table class="table table-head table-striped color-w">		    						
	    							<tr>
									  	<th style="padding-left: 65px;">序号</th>
									  	<th style="padding-left:30px">实际值</th>
									  	<th>参考值</th>
									  	<th style="padding-right: 25px;">判断</th>
									 </tr>
								</table>
		    					<div>
			    					<table class="table table-striped color-w table-msg">
			    								    										    									    									    						
			    						<tr id="netvoltageTr">
			    							<td>输入电压(V)</td>
			    							<td>123</td>
			    							<td>120-150</td>
			    							<td><i class="green-point"></i></td>
			    						</tr>
			    						<tr id="currentinputTr">
			    							<td>输入电流(A)</td>
			    							<td>123</td>
			    							<td>120-150</td>
			    							<td><i class="green-point"></i></td>
			    						</tr>
			    						<tr id="inputpowerTr">
			    							<td>输入功率(kW)</td>
			    							<td>123</td>
			    							<td>120-150</td>
			    							<td><i class="green-point"></i></td>
			    						</tr>
			    						<tr id="intermediatevotTr">
			    							<td>中间电压(V)</td>
			    							<td>123</td>
			    							<td>120-150</td>
			    							<td><i class="green-point"></i></td>
			    						</tr>
			    						<tr id="currentoutputTr">
			    							<td>输出电流(A)</td>
			    							<td>123</td>
			    							<td>120-150</td>
			    							<td><i class="green-point"></i></td>
			    						</tr>
			    						<tr id="actualfreqTr">
			    							<td>输出频率(Hz)</td>
			    							<td>123</td>
			    							<td>120-150</td>
			    							<td><i class="red-point"></i></td>
			    						</tr>
			    						<tr id="m1w1Tr">
			    							<td>进口温度(&deg;C)</td>
			    							<td>123</td>
			    							<td>120-150</td>
			    							<td><i class="green-point"></i></td>
			    						</tr>
			    						<tr id="m1w2Tr">
			    							<td>整流温度(&deg;C)</td>
			    							<td>123</td>
			    							<td>120-150</td>
			    							<td><i class="green-point"></i></td>
			    						</tr>
			    						<tr id="m1w3Tr">
			    							<td>逆变温度(&deg;C)</td>
			    							<td>123</td>
			    							<td>120-150</td>
			    							<td><i class="green-point"></i></td>
			    						</tr>
			    					</table>
			    											
		    					</div>
		    					<div class="scbg">
		    						<a id="example1" href="javascript:void(0)"><img src="${path }/resource/images/scbg.png"></img></a>
		    					</div>
		    				</div>
	    				</div>
	    			</div>	    				    			
	    		</div>
	    	</div>
	    	<!-- 右侧列表 -->
	    	<div class=" col-xs-3 right-ul center">
	    		<div class="right-list">
	    			<div class="center">
			    		<div class="input-group search-input ">
					      <input id="require" type="text"  class="form-control float-r search back-m1 color-w">
					      <span class="input-group-btn search-span"">
					        <button class="btn btn-default search-btn" type="button" onclick="search();"></button>
					      </span>
						</div>
						<div class="left table-head color-w">
							<span >序列号</span><span class="float-r">运行状态</span>
						</div>
						<div class="ul-div">
	 
							<table id="listtable" class="table table-striped color-w">
							  
							  <tr>
							  	<td class="left"><a class="color-w" href="<%=path%>/manage/redirect/allEquip/faultAnalysis?serialNum=0181413C">0181413C</a></td>
							  	<td class="right">正常</td>
							  </tr>
							  <tr>
							  	<td class="left"><a class="color-w" href="<%=path%>/manage/redirect/allEquip/faultAnalysis?serialNum=0181413C">0181413C</a></td>
							  	<td class="right">正常</td>
							  </tr>
							  <tr>
							  	<td class="left"><a class="color-w" href="<%=path%>/manage/redirect/allEquip/faultAnalysis?serialNum=0181413C">0181413C</a></td>
							  	<td class="right">正常</td>
							  </tr>
							  
							</table>
						</div>
						
					</div>
	    		</div>
	    	</div>
	    	
	    	<!-- 底部表格 -->
	    	<div class="foot-img">
	    		<div class="col-xs-4 margin-t-1 ">
	    			<div class="foot-div1 back-a"> 
	    				<div class="point foot-name">变频器健康管理</div>
	    				<div style="width:60%;height:100%;display:inline-block;height: calc(100% - 25px);">
							<div style="height:33.3%;padding:5px">总时长:<span>43800h</span></div>
							<div style="height:33.3%;padding:5px">
								<span>运行时长</span>	    				
		    					<div class="progress ding">
		    						<div id="zongshichangpro" class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 40%;"></div>
								</div>
								<span class="m-color" id="zongshichang">10000h</span>
							</div>
							<div style="height:33.3%;padding:5px" >
								<span>运行时长</span>	    				
		    					<div class="progress ding">
		    						<div id="syzongshichangpro" class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 80%;"></div>
								</div>
								<span class="m-color" id="syzongshichang">10000h</span>
							</div>
							
						</div>
						<div style="float:right;width:39%;height:100%;height: calc(100% - 25px);">
							<div id="b3echarts3" style="float:left;width: 100%; height:100%;"></div>
						</div>
	    			</div>
	    		</div>
	    		<div class="col-xs-4 margin-t-1 padding-l">
	    			<div class="foot-div2  back-a"> 
	    				<div class="point foot-name">关键器件健康管理</div>
	    				<!-- <div class="col-xs-6">
		    				<span>模块一</span><br>
		    				<span id="ratem1w1">进口温度:</span><a class="yes"></a><br>
		    				<span id="ratem1w2">整流温度:</span><a class="yes"></a><br>
		    				<span id="ratem1w3">逆变温度:</span><a class="yes"></a><br>
	    				</div>
	    				<div class="col-xs-6">
		    				<span>模块二</span><br>
		    				<span id="ratem2w1">进口温度:</span><a class="yes"></a><br>
		    				<span id="ratem2w2">整流温度:</span><a class="yes"></a><br>
		    				<span id="ratem2w3">逆变温度:</span><a class="yes"></a><br>
	    				</div>	    					    		 -->				    				
						<div style="height:calc(100% - 25px);width:100%">
							<div class="qjgl">
								<span class="color-m2">IGBT&nbsp;&nbsp;&nbsp;</span>
								    				
			    					<div class="progress gjqj1">
			    						<div id="IGBTpro" class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 10%;"></div>
									</div>
								<span class="color-w" id="IGBT">500/43800h</span>
							</div>
							<div class="qjgl">
								<span class="color-m2">电抗器</span>
								   				
			    					<div class="progress gjqj2">
			    						<div id="diankangqipro" class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 50%;"></div>
									</div>
								<span class="color-w" id="diankangqi">500/43800h</span>
							</div>
							<div class="qjgl">
								<span class="color-m2">电&nbsp;容&nbsp;&nbsp;</span>
								   				
			    					<div class="progress gjqj3">
			    						<div id="dianrongpro" class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 80%;"></div>
									</div>
								<span class="color-w" id="dianrong">500/43800h</span>
							</div>
						</div>
	    			</div>
	    		</div>
	    		<div class="col-xs-4 margin-t-1 ">
	    			<div class="foot-div3 back-a  "> 
<!-- 	    				<div class="point foot-name">开关保修期内动作次数 、保修期内时长</div> -->
	    				<!-- <div>
	    					<span>开关保修期内动作次数：</span><span id="otherBreakerstate" class="font-foot">0</span><span>次</span><br>
	    				</div>
	    				<div>
	    					<span>变频器保修期内时长：</span><span id="otherHours" class="font-foot">0</span>
	    				</div> -->
<!-- 	    				<div id="iserror" class="foot-span"> -->
<!-- 		    				变频器正常 -->
<!-- 	    				</div> -->
						<div class="point foot-name">易耗件健康管理</div>
						<div id="b3echarts1" style="float:left;width: 50%; height: calc(100% - 25px);"></div>
						<div id="b3echarts2" style="float:left;width: 50%; height: calc(100% - 25px);"></div>
	    			</div>
	    		</div>
	    	</div>
    	</div>
    </div>
	<!--弹窗-->
	<div class="layer" style="display: none;">
		<div class="layer-bg">
			<div class="layer-head point foot-name">
				<span>报告发送:</span>
				<a class="off-layer" id='esc2'>X</a>
			</div>
			<div  class="layer-body">	
				<div class="layer-main">
					<div class="layer-search">
		     			<div class="input-group  ">
						      <input id="layerRequire" type="text"  class="form-control float-r search back-m1 color-w">
						      <span class="input-group-btn search-span"">
						        <button class="btn btn-default search-btn" type="button" onclick="layerSearch();"></button>
						      </span>
						</div>
						<label class='search-msg color-m2'><input name='identity' type='radio' value="1">按姓名</label>
						<label class='search-msg color-m2'><input name='identity' type='radio' value="1">按工号</label>
						<label class='search-msg color-m2'><input name='identity' type='radio' value="1">按联系电话</label>
					</div>
					<div class="div-table2">
		     			<table id="mailList" class='table center table-striped table-hover layer-table'>
		     				<tr class="color-m2 " >
		     					<th class="text-center">姓名</th>
		     					<th class="text-center">工号</th>
		     					<th class="text-center">邮箱地址</th>
		     					<th class="text-center">联系电话</th>
		     				</tr>
		     				<tr>
		     					<td>张三</td>
		     					<td>20101010</td>
		     					<td>zhangsan1@csrzic.com</td>
		     					<td>18810101010</td>
		     				</tr>
		     				<tr>
		     					<td>王五</td>
		     					<td>20101010</td>
		     					<td>zhangsan2@csrzic.com</td>
		     					<td>18810101010</td>
		     				</tr>
		     				<tr>
		     					<td>老王</td>
		     					<td>20101010</td>
		     					<td>zhangsan3@csrzic.com</td>
		     					<td>18810101010</td>
		     				</tr>
		     				<tr>
		     					<td>小三</td>
		     					<td>20101010</td>
		     					<td>zhangsan4@csrzic.com</td>
		     					<td>18810101010</td>
		     				</tr>			     						     				
		     			</table> 
	     			</div> 	
     			</div>  
     			<div class="consignee">
     				<div class="c-name">
     					收件人
	     			</div>
	     			<div class="c-names">
						<span class="color-w email-name" id="sjrSpan"></span>
					</div>
     			</div>
     			<div class="sure-btn">
	     			<span class="btn-white " id="send">确定</span>
	     			<span class="btn-white " id="esc">取消</span>	
     			</div>	    
			</div>
			<div class="layer-body2" style="display:none">
				<img class='sending'src='${path }/resource/images/zzfs.png'><br><br>
				<span class="color-w">正在发送</span>
			</div>
			<div class="layer-body3" style="display:none">
				<img src='${path }/resource/images/fswc.png'><br><br>
				<span class="color-w">发送成功</span>
			</div>
		</div>
	</div>



	
</body>
<script type="text/javascript" src="${path}/resource/js/webSocketConf.js"></script>	
<script type="text/javascript">
	/**保留两位小数   功能：将浮点数四舍五入，取小数点后2位  */
	function toDecimal(x) {  
	    var f = parseFloat(x);  
	    if (isNaN(f)) { 
	        return;  
	    }  
	    f = Math.round(x*100)/100;  
	    return f;  
	}
</script>
<script type="text/javascript" src="http://html2canvas.hertzen.com/build/html2canvas.js"></script>   
<script type="text/javascript" >

/*弹窗*/
var dataUrl;
$(function(){
	$("#example1").click(function(event){
		event.preventDefault();
		html2canvas(document.body, {
			allowTaint: true,
		    taintTest: false,
		    onrendered: function(canvas) {
		        canvas.id = "mycanvas";
		        //document.body.appendChild(canvas);
		        //生成base64图片数据
		        dataUrl = canvas.toDataURL();
		      	dataUrl = dataUrl.substring(dataUrl.indexOf(',') + 1, dataUrl.length);
		      	
		      	$(".layer").show();
				initMailUserList();
		    }
		});
	});
	
	$("#esc").click(function(){
		$(".layer").hide();
		$("#layerRequire").val("");
		$('#sjrSpan').text("");
		
	});
	$("#esc2").click(function(){
		$(".layer").hide();
		$("#layerRequire").val("");
		$('#sjrSpan').text("");
		$('.layer-body').show();
		$('.layer-body3').hide();
		$('.layer-body2').hide();
	});
})

function layerSearch() {
	initMailUserList();
}

function initMailUserList() {
	$.ajax({
		type : 'POST',
		url : '<%=path%>/monitor/mailUserList',
		data : {
			require : $("#layerRequire").val(),
			type : $('input:radio[name="identity"]:checked').val()
		},
		dataType : 'json',
		async : false,
		success : function(result) {
			if(result.status == "OK") {
				$('#mailList').text('');
				var html = '<tr class="color-m2"><th class="text-center">姓名</th>'+
							'<th class="text-center">工号</th>'+
								'<th class="text-center">邮箱地址</th>'+
								'<th class="text-center">联系电话</th></tr>';
				$.each(result.data, function(i){
					
					html += '<tr><td>'+result.data[i].userName+'</td>'+
							'<td>'+result.data[i].userId+'</td>'+
	     					'<td>'+result.data[i].mail+'</td>'+
	     					'<td>'+result.data[i].phone+'</td></tr>';
	     				
				});
				$('#mailList').append(html);
			}
		},
		error : function() {
			//alert("系统错误！");
		}
	});
	
}

$("#send").click(function(){
	var nameArr = new Array()
	$(".selected").each(function(){
		nameArr.push($(this).children('td').eq(2).text())
	});
	console.log(nameArr);
	$(".layer-body").hide();
	$(".layer-body2").show();
    $.ajax({
		type : 'POST',
		url : '<%=path%>/monitor/managermesspush',
		data : {
			receiver : nameArr.join(";"),
			mailtheme : '设备健康报告',
			mailcontent : '设备健康报告',
			fileString : dataUrl,
			fileFormat : 'png'
		},
		dataType : 'json',
		async : true,
		success : function(result) {
			if(result.status == 'OK') {
				if(result.data != null && result.data.resultCode == "1") {					
					$(".layer-body2").hide();
					$(".layer-body3").show();
					
				} else {
					alert(result.data.resultMessage);
				}
			} else {
				alert("邮件发送失败！");
				
			}
		}
	});
    
    
	$("#layerRequire").val("");
	$('#sjrSpan').text("");
})

</script>

<script type="text/javascript">

$(function(){
	$(".img-qbsb").parent().css({"color":"#82d1e8","text-shadow":" 0px 0px 10px #b7d6df"});
	$(".img-qbsb").parent().parent().addClass("dl-active");
	$(".img-qbsb").attr("src","${path}/resource/images/qbsb2.png"); 
	
	initBottom1();
})	
	//加载主图对比数据
	function initCompare() {
// 		var iserror = false;
		$.ajax({
			type : 'POST',
			url : '<%=path%>/manage/secondliveData',
			data : {
				serialNum : '${serialNum}'
			},
			dataType : 'json',
			async : false,
			success : function(result) {
				if(result.status == 'OK') {
					var devInfo = eval("(" + result.data.devInfo + ")")[0];
					console.log(devInfo);
					//$('#breakerstate').text(devInfo.breakerstate);
					//输入电压
					$('#netvoltageTr td')[1].innerHTML = netvoltage;
					$('#netvoltageTr td')[2].innerHTML = toDecimal(0.7*(devInfo.ratedInputVoltage)) + '-' + toDecimal(1.2*(devInfo.ratedInputVoltage));
					if(1.2*(devInfo.ratedInputVoltage) < netvoltage || 0.7*(devInfo.ratedInputVoltage) > netvoltage) {
// 						$('#ratedInputVoltage').next('a').removeClass('yes');
// 						$('#ratedInputVoltage').next('a').addClass('error');
// 						iserror = true;
						$('#netvoltageTr td i')[0].className = 'red-point';
					}
					//输入电流
					$('#currentinputTr td')[1].innerHTML = currentinput;
					$('#currentinputTr td')[2].innerHTML = 0 + '-' + toDecimal(1.1*(devInfo.ratedInputCurrent));
					if(1.1*(devInfo.ratedInputCurrent) < currentinput ) {
// 						$('#ratedInputCurrent').next('a').removeClass('yes');
// 						$('#ratedInputCurrent').next('a').addClass('error');
// 						iserror = true;
						$('#currentinputTr td i')[0].className = 'red-point';
					}
					//输入功率
					$('#inputpowerTr td')[1].innerHTML = inputpower;
					$('#inputpowerTr td')[2].innerHTML = 0 + '-' + toDecimal(devInfo.ratedInputPower);
					if(devInfo.ratedInputPower < inputpower && inputpower < 1.1*(devInfo.ratedInputPower)) {
						$('#inputpowerTr td i')[0].className = 'yellow-point';
					} else if(inputpower > 1.1*(devInfo.ratedInputPower)){
						$('#inputpowerTr td i')[0].className = 'red-point';
					}
					//中间电压
					$('#intermediatevotTr td')[1].innerHTML = intermediatevot;
					$('#intermediatevotTr td')[2].innerHTML = toDecimal(devInfo.interVoltMin) + '-' + toDecimal(devInfo.interVoltMax);
					if(inputpower < devInfo.interVoltMin || inputpower > devInfo.interVoltMax) {
						$('#intermediatevotTr td i')[0].className = 'red-point';
					}
					//输出电流
					$('#currentoutputTr td')[1].innerHTML = currentinput;
					$('#currentoutputTr td')[2].innerHTML = 0 + '-' + toDecimal(1.1*(devInfo.ratedOutputCurrent));
					if(1.1*(devInfo.ratedOutputCurrent) < currentoutput ) {
// 						$('#ratedOutputCurrent').next('a').removeClass('yes');
// 						$('#ratedOutputCurrent').next('a').addClass('error');
// 						iserror = true;
						$('#currentoutputTr td i')[0].className = 'red-point';
					}
					//输出频率
					$('#actualfreqTr td')[1].innerHTML = actualfreq;
// 					$('#actualfreqTr td')[2].innerHTML = toDecimal(devInfo.interVoltMin) + '-' + toDecimal(devInfo.interVoltMax);
// 					if(inputpower < devInfo.interVoltMin || inputpower > devInfo.interVoltMax) {
// 						$('#actualfreqTr td i')[0].className = 'red-point';
// 					}
					//进口温度
					$('#m1w1Tr td')[1].innerHTML = m1w1;
					$('#m1w1Tr td')[2].innerHTML = toDecimal(devInfo.temperatureMin) + '-' + toDecimal(devInfo.temperatureMax);
					if(m1w1 < devInfo.temperatureMin || m1w1 > devInfo.temperatureMax) {
// 						$('#ratem1w1').next('a').removeClass('yes');
// 						$('#ratem1w1').next('a').addClass('error');
// 						iserror = true;
						$('#m1w1Tr td i')[0].className = 'red-point';
					}
					$('#m1w2Tr td')[1].innerHTML = m1w2;
					$('#m1w2Tr td')[2].innerHTML = toDecimal(devInfo.temperatureMin) + '-' + toDecimal(devInfo.temperatureMax);
					if(m1w2 < devInfo.temperatureMin || m1w2 > devInfo.temperatureMax) {
// 						$('#ratem1w2').next('a').removeClass('yes');
// 						$('#ratem1w2').next('a').addClass('error');
// 						iserror = true;
						$('#m1w2Tr td i')[0].className = 'red-point';
					}
					$('#m1w3Tr td')[1].innerHTML = m1w3;
					$('#m1w3Tr td')[2].innerHTML = toDecimal(devInfo.temperatureMin) + '-' + toDecimal(devInfo.temperatureMax);
					if(m1w3 < devInfo.temperatureMin || m1w3 > devInfo.temperatureMax) {
// 						$('#ratem1w3').next('a').removeClass('yes');
// 						$('#ratem1w3').next('a').addClass('error');
// 						iserror = true;
						$('#m1w3Tr td i')[0].className = 'red-point';
					}
// 					if(m2w1 > devInfo.temperatureMax) {
// 						$('#ratem2w1').next('a').removeClass('yes');
// 						$('#ratem2w1').next('a').addClass('error');
// 						iserror = true;
// 					}
// 					if(m2w2 > devInfo.temperatureMax) {
// 						$('#ratem2w2').next('a').removeClass('yes');
// 						$('#ratem2w2').next('a').addClass('error');
// 						iserror = true;
// 					}
// 					if(m2w3 > devInfo.temperatureMax) {
// 						$('#ratem2w3').next('a').removeClass('yes');
// 						$('#ratem2w3').next('a').addClass('error');
// 						iserror = true;
// 					}
// 					if(iserror) {
// 						$('#iserror').html('变频器异常!请及时联系用户排查原因.');
// 					} else {
// 						$('#iserror').html('变频器正常!请继续保持并关注.');
// 					}
					//$('#temperatureMax').text(devInfo.temperatureMax);
					
// 					$('#otherBreakerstate').text(100000-devInfo.breakerstate);
// 					if(devInfo.operationDate != null && devInfo.operationDate != undefined && devInfo.operationDate != "") {
// 						var year = parseInt(devInfo.operationDate.substring(0,4)) + 3;
// 						$('#otherHours').text(year + devInfo.operationDate.substring(4));
// 					}
				} else {
					//alert("系统错误！");
				}
			},
			error : function() {
				//alert("系统错误！");
			}
		})
	}
	
	//加载下方图表
	function initBottom1() {
		//运行总时长
		$.ajax({
			url : '<%=path%>/manage/secondhistDataRuntime',
			data : { serialNum : '${serialNum}' },
	        type : 'post',
	        dataType : 'json',
	        async : false,	        
	        success : function(result) {
	        	if(result.status == "OK") {
		        	$('#zongshichang').text(result.data + 'h');
		        	$('#IGBT').text(result.data + '/43800');
		        	$('#diankangqi').text(result.data + '/43800');
		        	$('#dianrong').text(result.data + '/43800');
		        	$('#zongshichangpro').css("width", (100*result.data/43800)+'%');
		        	$('#IGBTpro').css("width", (100*result.data/43800)+'%');
		        	$('#diankangqipro').css("width", (100*result.data/43800)+'%');
		        	$('#dianrongpro').css("width", (100*result.data/43800)+'%');
		        	$('#syzongshichang').text((43800 - result.data) + 'h');
		        	$('#syzongshichangpro').css("width", (100*(43800 - result.data)/43800)+'%');
	        	}
			},			
			error : function(result) {
				console.log('error');
			}
		});	
	}
	
	var b3echarts1 = echarts.init(document.getElementById("b3echarts1"));
	var b3echarts2 = echarts.init(document.getElementById("b3echarts2"));
	var b3echarts3 = echarts.init(document.getElementById("b3echarts3"));
	var b3echarts1Option = {
	    color:['#48a0fe','#48f2ff'],
		title: {
	        text: '共计：4000h',
	        bottom: '5%',
	        right: '0',
	        textStyle:{
	        	fontSize:10,
	        	color:'#48f2ff'
	        }
	    },
	    legend: {
	        orient: 'vertical',
	        top: '10%',
	        right: '0',
	        itemGap: 10,
	        formatter: function (name) {
	            if(name == '剩余') {
	                return name + '1600h';
	            }else{
	                return name + '2400h';
	            }
	        },
	        textStyle:{
	        	color:'#fff'
	        },
	        data:['剩余','运行']
	    },
	    series: [
	        {
	            name:'访问来源',
	            type:'pie',
	            center: ['30%', '50%'],
	            radius: ['60%', '80%'],
	            avoidLabelOverlap: false,
	            label: {
	                normal: {
	                    show: true,
	                    position: 'center',
	                    formatter: function(params){
	                        if(params.name == '运行') {
	                            return params.percent +'%\n风机寿命';
	                        } else {
	                            return '';
	                        }
	                    },
	                    textStyle: {
	                        color: '#fff',
	                        fontSize: '10',
	                        fontWeight: 'bold'
	                    }                  
	                }
	            },
	            labelLine: {
	                normal: {
	                    show: false
	                }
	            },
	            itemStyle: {
	            	
	            	emphasis: {
	            	show: false
	            }},
	            data:[
	                {value:335, name:'剩余'},
	                {value:310, name:'运行'}
	            ]
	        }
	    ]
	};
	b3echarts1.setOption(b3echarts1Option);
	var b3echarts2Option = {
		    color:['#48a0fe','#286090'],
			title: {
		        text: '共计：4000h',
		        bottom: '5%',
		        right: '0',
		        textStyle:{
		        	fontSize:10,
		        	color:'#286090'
		        }
		    },
		    legend: {
		        orient: 'vertical',
		        top: '10%',
		        right: '0',
		        itemGap: 10,
		        formatter: function (name) {
		            if(name == '剩余') {
		                return name + '1600次';
		            }else{
		                return name + '2400次';
		            }
		        },
		        textStyle:{
		        	color:'#fff'
		        },
		        data:['剩余','运行']
		    },
		    series: [
		        {
		            name:'访问来源',
		            type:'pie',
		            center: ['30%', '50%'],
		            radius: ['60%', '80%'],
		            avoidLabelOverlap: false,
		            label: {
		                normal: {
		                    show: true,
		                    position: 'center',
		                    formatter: function(params){
		                        if(params.name == '运行') {
		                            return params.percent +'%\n断路器寿命';
		                        } else {
		                            return '';
		                        }
		                    },
		                    textStyle: {
		                        color: '#fff',
		                        fontSize: '10',
		                        fontWeight: 'bold'
		                    }                  
		                }
		            },
		            labelLine: {
		                normal: {
		                    show: false
		                }
		            },
		            itemStyle: {
		            	
		            	emphasis: {
		            	show: false
		            }},
		            data:[
		                {value:335, name:'剩余'},
		                {value:310, name:'运行'}
		            ]
		        }
		    ]
		};
	b3echarts2.setOption(b3echarts2Option);
	var b3echarts3Option = {
		    color:['#48a0fe','#48f2ff'],
			
		    series: [
		        {
		            name:'访问来源',
		            type:'pie',
		            center: ['50%', '50%'],
		            radius: ['60%', '80%'],
		            avoidLabelOverlap: false,
		            label: {
		                normal: {
		                    show: true,
		                    position: 'center',
		                    formatter: function(params){
		                        if(params.name == '运行') { 
		                            return params.percent +'分';
		                        } else {
		                            return '';
		                        }
		                    },
		                    textStyle: {
		                        color: '#fff',
		                        fontSize: '10',
		                        fontWeight: 'bold'
		                    }                  
		                }
		            },
		            labelLine: {
		                normal: {
		                    show: false
		                }
		            },
		            itemStyle: {
		            	
		            	emphasis: {
		            	show: false
		            }},
		            data:[
		                {value:335, name:'剩余'},
		                {value:310, name:'运行'}
		            ]
		        }
		    ]
		};
		b3echarts3.setOption(b3echarts3Option);
	function initBottom3() {
		
	}
	
	
	
	//加载右侧列表
	function search() {
		$.ajax({
			type : 'POST',
			url : '<%=path%>/manage/seconddevTotal',
			data : {
				livedata : livedata,
				require : $("#require").val()
			},
			dataType : 'json',
			async : false,
			success : function(result) {
				if(result.status == "OK") {
					$('#listtable').text('');
					//var html = "<tr><th>变频器序列号</th><th>安装位置</th><th>投运时间</th><th>工作状态</th></tr>";
					var html = "";
					$.each(result.data, function(i){
						var href = "<%=path%>/manage/redirect/allEquip/nowEquip?serialNum="+result.data[i].serialNum;
						html += '<tr><td class="left"><a href='+href+'>'+result.data[i].serialNum +
								'</a></td><td class="right">'+result.data[i].state +'</td></tr>';
					});
					$('#listtable').append(html);
				}
			},
			error : function() {
				//alert("系统错误！");
			}
		})
	}

	var theoreticspeed = 0;
	
// 	var netvoltagespan,currentinputspan,inputpowerspan;
// 	var intermediatevotspan,intermediatecurrentspan,currentoutputspan;
// 	var actualfreqspan;
	
	var netvoltage,currentinput,inputpower,intermediatevot,currentoutput,actualfreq;
	
	var m1w1=0,m1w2=0,m1w3=0;
	var m2w1=0,m2w2=0,m2w3=0;
	
	var webInitState = false;//只在初始化加载一次websocket推送消息

	//获取指定设备实时数据
	jQuery.browser={};
    (function(){
    	jQuery.browser.msie=false; 
    	jQuery.browser.version=0;
    	if(navigator.userAgent.match(/MSIE ([0-9]+)./)){ 
    		jQuery.browser.msie=true;
    		jQuery.browser.version=RegExp.$1;
    	}
    })();
	var webSocket = null;
	if ("WebSocket" in window) {
		webSocket = new WebSocket(webSocketUrl);
		console.log("建立实时连接！");
	} else if ("MozWebSocket" in window) {
		webSocket = new MozWebSocket(webSocketUrl);
		console.log("建立实时连接！");
	} else {
		alert("浏览器不支持！");
	};
	webSocket.onerror = function() {
		alert("无法建立实时连接！");
	};
	webSocket.onopen = function(event) {
		send();
		console.log("open");
	};
	webSocket.onmessage = function() {
		if(!webInitState) {
			if(event.data.length>2){
				var map=eval(JSON.parse(event.data.toString()));
				for ( var dev in map) {
					//console.log(key+" : "+map[dev][key]);
	// 				for ( var key in map[dev]) {
	// 					led(key,map[dev][key]);
	// 				}	
// 					netvoltage = map[dev]["netvoltage"] == undefined || map[dev]["netvoltage"] == "undefined" ? 0 : map[dev]["netvoltage"];
// 					currentinput = map[dev]["currentinput"] == undefined || map[dev]["currentinput"] == "undefined" ? 0 : map[dev]["currentinput"];
// 					inputpower = map[dev]["inputpower"] == undefined || map[dev]["inputpower"] == "undefined" ? 0 : map[dev]["inputpower"];
// 					intermediatevot = map[dev]["intermediatevot"] == undefined || map[dev]["intermediatevot"] == "undefined" ? 0 : map[dev]["intermediatevot"];
// 					currentoutput = map[dev]["currentoutput"] == undefined || map[dev]["currentoutput"] == "undefined" ? 0 : map[dev]["currentoutput"];
// 					actualfreq = map[dev]["actualfreq"] == undefined || map[dev]["actualfreq"] == "undefined" ? 0 : map[dev]["actualfreq"];
					
// 					m1w1 = map[dev]["module1temperature1"] == undefined || map[dev]["module1temperature1"] == "undefined" ? 0 : map[dev]["module1temperature1"];
// 					m1w2 = map[dev]["module1temperature2"] == undefined || map[dev]["module1temperature2"] == "undefined" ? 0 : map[dev]["module1temperature2"];
// 					m1w3 = map[dev]["module1temperature3"] == undefined || map[dev]["module1temperature3"] == "undefined" ? 0 : map[dev]["module1temperature3"];
// 					m2w1 = map[dev]["module2temperature1"] == undefined || map[dev]["module2temperature1"] == "undefined" ? 0 : map[dev]["module2temperature1"];
// 					m2w2 = map[dev]["module2temperature2"] == undefined || map[dev]["module2temperature2"] == "undefined" ? 0 : map[dev]["module2temperature2"];
// 					m2w3 = map[dev]["module2temperature3"] == undefined || map[dev]["module2temperature3"] == "undefined" ? 0 : map[dev]["module2temperature3"];

					netvoltage = map[dev]["c86"] == undefined || map[dev]["c86"] == "undefined" ? 0 : map[dev]["c86"];
					currentinput = map[dev]["c85"] == undefined || map[dev]["c85"] == "undefined" ? 0 : map[dev]["c85"];
					inputpower = map[dev]["c217"] == undefined || map[dev]["c217"] == "undefined" ? 0 : map[dev]["c217"];
					intermediatevot = map[dev]["c87"] == undefined || map[dev]["c87"] == "undefined" ? 0 : map[dev]["c87"];
					currentoutput = map[dev]["c84"] == undefined || map[dev]["c84"] == "undefined" ? 0 : map[dev]["c84"];
					actualfreq = map[dev]["c83"] == undefined || map[dev]["c83"] == "undefined" ? 0 : map[dev]["c83"];
					m1w1 = map[dev]["c79"] == undefined || map[dev]["c79"] == "undefined" ? 0 : map[dev]["c79"];
					m1w2 = map[dev]["c80"] == undefined || map[dev]["c80"] == "undefined" ? 0 : map[dev]["c80"];
					m1w3 = map[dev]["c81"] == undefined || map[dev]["c81"] == "undefined" ? 0 : map[dev]["c81"];
					m2w1 = map[dev]["c188"] == undefined || map[dev]["c188"] == "undefined" ? 0 : map[dev]["c188"];
					m2w2 = map[dev]["c189"] == undefined || map[dev]["c189"] == "undefined" ? 0 : map[dev]["c189"];
					m2w3 = map[dev]["c190"] == undefined || map[dev]["c190"] == "undefined" ? 0 : map[dev]["c190"];
					
	// 				console.log(m1w1);console.log(m1w2);console.log(m1w3);
	// 				$('#m1w1').css("width", m1w1+'%'); $('#m1w1').parent('div').next('span').children('span').text(m1w1); 
	// 				$('#m1w2').css("width", m1w2+'%'); $('#m1w2').parent('div').next('span').children('span').text(m1w2); 
	// 				$('#m1w3').css("width", m1w3+'%'); $('#m1w3').parent('div').next('span').children('span').text(m1w3); 
	// 				$('#m2w1').css("width", m2w1+'%'); $('#m2w1').parent('div').next('span').children('span').text(m2w1); 
	// 				$('#m2w2').css("width", m2w2+'%'); $('#m2w2').parent('div').next('span').children('span').text(m2w2); 
	// 				$('#m2w3').css("width", m2w3+'%'); $('#m2w3').parent('div').next('span').children('span').text(m2w3);
					
					initCompare();
				}	
				webInitState = true;
			} else{
			 	console.log("resend...");
				send(); 
			}	
		}
	};
	function send(){    //Websocket接口
		var message = "[{\"serialnum\":\"${serialNum}\",\"signalnames\":[\"all\"]}]";//调用参数
		//console.log(message);
		webSocket.send(message);
	};
// 	window.onload = function(){
// 		checkcount();
// 	};
	window.onbeforeunload = function (e) { 
		e = e || window.event; 
		if (e) { 
			webSocket.close();
		} 
	};
	
	function led(key,value){
// 		var ledspan = $('.maoled span');
// 		for(var i=0; i<ledspan.length; i++){
// 			if(key == ledspan[i].id){
// 				if(value) {
// 					$("#"+ledspan[i].id).removeClass("color-red3");
// 					if(key == "faultlight") {
// 						$("#"+ledspan[i].id).addClass("color-green3");
// 					} else {
// 						$("#"+ledspan[i].id).addClass("color-green3");
// 					}
// 				} else {
// 					$("#"+ledspan[i].id).removeClass("color-green3");
// 					//$("#"+ledspan[i].id).removeClass("color-g");
// 					$("#"+ledspan[i].id).addClass("color-red3");
// 				}
// 			}
// 		}
// 		var ledspan = $('.maoled span');
// 		for(var i=0; i<ledspan.length; i++){
// 			if(key == ledspan[i].id){
// 				if(value) {
// 					$("#"+ledspan[i].id).removeClass("color-b");
// 					if(key == "faultlight") {
// 						$("#"+ledspan[i].id).addClass("color-r");
// 					} else {
// 						$("#"+ledspan[i].id).addClass("color-g");
// 					}
// 				} else {
// 					$("#"+ledspan[i].id).removeClass("color-r");
// 					$("#"+ledspan[i].id).removeClass("color-g");
// 					$("#"+ledspan[i].id).addClass("color-b");
// 				}
// 			}
// 		}
	}
	
//获取设备列表实时数据
	
	var webSocket2 = null;
    var livedata;
    if ("WebSocket" in window) {
		webSocket2 = new WebSocket(webSocketUrl);
		console.log("建立实时连接！");
	} else if ("MozWebSocket" in window) {
		webSocket2 = new MozWebSocket(webSocketUrl);
		console.log("建立实时连接！");
	} else {
		alert("浏览器不支持！");
	}
	webSocket2.onerror = function() {
		alert("无法建立实时连接！");
	};
	webSocket2.onopen = function(event) {
		send2();
		console.log("open");
	};
	webSocket2.onmessage = function() {
		if(event.data.length>2){
			livedata=event.data;
			//tableinitinfo();
			search();
			webSocket2.close();
		}else{
			console.log("resend...");
			send2();
		}		
	};
	webSocket2.onclose = function() {
	};
	window.onbeforeunload = function() {
		webSocket2.close();
	};
	function send2(){    //Websocket接口
	    console.log("send");
// 	    var message = "[{\"serialnum\":\"all\",\"signalnames\":[\"breakerstate\",\"runninglight\",\"faultlight\"]}]";//调用参数
	    var message = "[{\"serialnum\":\"all\",\"signalnames\":[\"c196\",\"c78\",\"c77\"]}]";//调用参数
	    webSocket2.send(message);
	}
 	/*报告发送选中时间*/
 	$(function(){
 		$("#mailList").on("click",'tr',function(){
 			if($(this).hasClass('selected')){
 				$(this).removeClass('selected');
 				var allName=$(".email-name").text()
 				var name=$(this).children('td').eq(0).text()+','			
 				allName=allName.replace(name,"");
 				$(".email-name").text(allName);
 				
 			}else{
 				$(this).addClass('selected');
 				var name=$(this).children('td').eq(0).text()+','
 				console.log($(this).children('td').eq(0).text());
 				var emailname = $(".email-name")[0].textContent;
 				if(emailname.indexOf(name) == -1) {
 					$(".email-name").append(name);
 				}
 			} 			
 		})
 	})
 	
</script>
</html>